<template>
  <div class="header-title" :style="{color: isDark ? '#ffffff' : '#006400'}">
    综合风险调查数据成果应用系统
    <menu-tag title="返回首页" :is-dark="isDark" icon="el-icon-back" @click="tagClick"/>
    <menu-tag :title="$route.meta.title" :is-dark="isDark"/>
  </div>
</template>

<script lang="ts">
import {Component, Prop, Vue} from 'vue-property-decorator';
import MenuTag from "@/components/MenuTag.vue";

@Component({
  components: {MenuTag}
})
export default class HeaderTitle extends Vue {
  @Prop({default: false}) private isDark!: boolean;
  tagClick(){
    this.$router.push('/')
  }
}
</script>
<style lang="scss" scoped>
.header-title{
  width: fit-content;
  text-align: center;
  color: #ffffff;
  font-family: sans - serif;
  font-size: 30px;
  font-weight: bold;
  display: flex;
  align-items: center;
  gap: 10px;
}
</style>
